
import { useState } from 'react';
function Repeat(props) {
    let items = [];
    for (let i = 0; i < props.numTimes; i++) {
        items.push(props.children(i));
    }
    return <div>{items}</div>;
}
  
function ListOfTenThings() {
    return (
        <Repeat numTimes={10}>
            {
                (index) => <div key={index}>This is item {index} in the list</div>
            }
        </Repeat>
    );
}


function JSX() {
    const [count,setCount] = useState(0)
    function handleClick() {
        setCount(count+1)
    }
    return (
        <div>
            <h1>JSX</h1>
            <div>count:{count}</div>
            <button onClick={ handleClick }>点击</button>
            <ListOfTenThings />
        </div>
    )
}

export default JSX;